import IntegrationTable, {
	IntegrationTableProps,
} from "@/components/IntegrationTable";
import type { ProColumns, ActionType } from "@ant-design/pro-table";
import React, { useEffect, useState, useRef } from "react";
import { Card, Tabs, Row, Statistic, Col, Image, Radio } from "antd";
import { DynamicFormItem } from "@/components/DynamicForm";
import { arrayToObject, getArray, getString } from "phinney-toolkit";
import { getPartner } from "./service";
// @page 商家
const Business: React.FC<any> = () => {
	// 组件是否已经卸载
	let isUnMounted = false;
	let actionref: any = useRef();
	const [Status, setStatus] = useState<any>("0");
	const [partner, setPartner] = useState<any>({});

	const refuseTypeList = [
		{ label: "该类型商品暂不回收", value: 10 },
		{ label: "破损/污渍/损坏等较严重,暂不回收", value: 20 },
		{ label: "无法辨别回收物,请提交清晰的照片", value: 30 },
		{ label: "其他", value: 40 },
	];

	const conditionList = [
		{ label: "待审核", value: "0" },
		{ label: "审核通过", value: "1" },
		{ label: "已关闭", value: "-1" },
	];
	const getPartnerList = async () => {
		const res = await getPartner();
		setPartner({
			unPass: "待审核" + " " + res?.data.unPass,
			pass: "已审核" + " " + res?.data.pass,
			closed: "已拒绝" + " " + res?.data.closed,
		});
	};

	// 表格项
	const columns: any = [
		{
			title: "审核状态",
			dataIndex: "status",
			search: false,
			valueEnum: arrayToObject(conditionList),
		},
		{
			title: "提交时间",
			dataIndex: "createTime",
			search: false,
		},
		{
			title: "联系人",
			dataIndex: "linkPerson",
			search: false,
		},
		{
			title: "手机号",
			dataIndex: "linkPhone",
		},
		{
			title: "提交图片",
			dataIndex: "urls",
			search: false,
			render: (_, record: any) => {
				if (record.urls) {
					return (
						<Image.PreviewGroup>
							{record.urls.map((item: any) => {
								return <Image src={item} width={50} alt="" />;
							})}
						</Image.PreviewGroup>
					);
				}
			},
		},
	];

	const columns2: any = [
		{
			title: "审核状态",
			dataIndex: "status",
			search: false,
			valueEnum: arrayToObject(conditionList),
		},
		{
			title: "提交时间",
			dataIndex: "createTime",
			search: false,
		},
		{
			title: "联系人",
			dataIndex: "linkPerson",
			search: false,
		},
		{
			title: "手机号",
			dataIndex: "linkPhone",
		},
		{
			title: "提交图片",
			dataIndex: "urls",
			search: false,
			render: (_, record: any) => {
				if (record.urls) {
					return (
						<Image.PreviewGroup>
							{record.urls.map((item: any) => {
								return <Image src={item} width={50} alt="" />;
							})}
						</Image.PreviewGroup>
					);
				}
			},
		},
		{
			title: "审核时间",
			dataIndex: "checkTime",
			search: false,
		},
		{
			title: "审核状态",
			dataIndex: "reason",
			search: false,
			render: (_, record: any) => {
				if (record.status == 1) {
					return "审核通过";
				} else {
					return record.reason;
				}
			},
		},
	];
	const getFormItemsRadio = (vm: any, isEdit?: boolean): DynamicFormItem[] => {
		const { coupon } = vm.state;
		return [
			{
				type: "custom",
				label: "快捷驳回",
				name: "refuseType",
				required: true,
				render: (form: any, record: any) => {
					return (
						<Radio.Group
							options={refuseTypeList}
							onChange={({ target }) => {
								form?.setFieldsValue({
									refuseType: target?.value,
								});
								vm.setState({
									isTrue: target.value,
								});
							}}
						></Radio.Group>
					);
				},
			},

			...(vm.state.isTrue == 40
				? [
						{
							type: "textarea",
							name: "reason",
							label: "驳回原因",
							required: true,
						},
				  ]
				: []),
		];
	};
	const getFormItems = (vm: any, isEdit?: boolean): DynamicFormItem[] => {
		const { coupon } = vm.state;
		return [
			{
				type: "text",
				label: "推广员信息",
				name: "communityCode",
				fieldProps: {
					disabled: true,
				},
			},
			{
				type: "text",
				label: "所属小区",
				name: "communityAddress",
			},
			{
				type: "text",
				label: "推广员类型",
				name: "communityBuildingNum",
			},
			{
				type: "text",
				label: "加入时间",
				name: "communityPeopleNum",
				fieldProps: {
					disabled: true,
				},
			},
			{
				type: "text",
				label: "推广人数",
				name: "lon",
				fieldProps: {
					disabled: true,
				},
			},
			{
				type: "text",
				label: "推广收益",
				name: "lat",
				fieldProps: {
					disabled: true,
				},
			},
			{
				type: "text",
				label: "推广收益上线",
				name: "lat",
				fieldProps: {
					disabled: true,
				},
			},
			{
				type: "text",
				label: "已提现收益",
				name: "lat",
				fieldProps: {
					disabled: true,
				},
			},
		];
	};

	// 一体化表格props
	const tablePorps: IntegrationTableProps = {
		rowKey: "id",
		scroll: { x: 1000 },
		columns: Status == 0 ? columns : columns2,
		listProps: {
			url: "/sell/page",
			method: "GET",
			requestType: "params",
			paramsHandle: (params: any) => {
				return {
					...params,
					Status,
				};
			},
		},
		updateProps: {
			url: "/sell/pass",
			method: "POST",
			requestType: "params",
			btnText: Status !== 0 ? "审核" : "",
			paramsHandle: ({ ...params }: any, record: any) => {
				return {
					...params,
					status: -1,
				};
			},
			modalProps: {
				formValuesHandle: async (record: any, form: any) => {
					const { ...others } = record;
					return {
						...others,
					};
				},

				formProps: {
					labelCol: { span: 8 },
				},
				formItemsHandle: (_: any, vm: any) => {
					return getFormItemsRadio(vm, true);
				},
			},
			requestAfter: (res: any) => {
				getPartnerList();
			},
		},
		ref: (refs: any) => {
			actionref = refs?.actionRef;
		},
		handleOperating: (record: any) => [
			...(Status == "0"
				? [
						{
							type: "pop",
							props: {
								url: "/sell/pass",
								method: "POST",
								popProps: {
									title: "确定要通过审核吗?",
									requestBefore: () => {},
								},
								btnText: "通过",
								paramsHandle: (params: any, record: any) => {
									return {
										...params,
										status: 1,
									};
								},
								requestAfter: (res: any) => {
									getPartnerList();
								},
							},
						},
						...record,
				  ]
				: []),
		],
		tableBefore: () => {
			return (
				<div>
					<Card>
						<Tabs
							onChange={(activeKey) => {
								setStatus(activeKey);
								actionref?.reload();
							}}
						>
							<Tabs.TabPane tab={partner.unPass} key="0"></Tabs.TabPane>
							<Tabs.TabPane tab={partner.pass} key="1"></Tabs.TabPane>
							<Tabs.TabPane tab={partner.closed} key="-1"></Tabs.TabPane>
						</Tabs>
					</Card>
				</div>
			);
		},
	};

	// 初始化加载数据
	useEffect(() => {
		getPartnerList();
		return () => {
			isUnMounted = true;
		};
	}, []);

	return <IntegrationTable {...tablePorps} />;
};

export default Business;
